<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
		<title>Fei.TH Slider</title>
		<link rel="stylesheet" href="./css/slider.css" type="text/css" media="screen" title="no title" charset="utf-8">
		<link media="screen" href="./fancybox/jquery.fancybox-1.3.4.css" type="text/css" rel="stylesheet">
				
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
		<script>
			!window.jQuery && document.write('<script src="jquery-1.4.3.min.js"><\/script>');
		</script>	
		<script type="text/javascript" src="./fancybox/jquery.fancybox-1.3.4.pack.js"></script>			
		<script src="js/jquery.scrollTo-min.js" type="text/javascript"></script>
		<script src="js/jquery.localscroll-1.2.7-min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery.serialScroll-1.2.2-min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/slider.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/polaroid.js" type="text/javascript" charset="utf-8"></script>		
	</head>
	<body>
    	<div id="wrapper">
<!--        	<h1>Slider</h1>    -->
        	<div id="slider">    
	
            	<div class="scroll">
                	<div class="scrollContainer">
                		<div class="panel" id="home">
							<div class="panel-bg home">
								<img src="./img/hi.png" alt="Hi there. I'm Fei Hu."/>
								<span>I'm a Software Engineering graduate student.</span>
								<span> I do <em>Programming</em>.</span>
							</div>
						</div>
                		<div class="panel" id="about">
							<div class="panel-bg about">
								<img src="./img/about-me.png" />
								<div class="two-column">
									<div class="column-left">
										<img src="./img/face-icon.png" />
										<a href="#">My Resume(CV)</a>
									</div>
									<div class="column-right">				
										<p>A Programmer, An Amateur Photographer, A Dreamer. I'm currently studying Software Engineering at Southern Methodist University and will graduate in May, 2011.'</p>
									</div>
								</div>	
							</div>	
						</div>
                		<div class="panel" id="work">
							<div class="panel-bg">
								<img src="./img/work.png" />									
								<p><strong>I ♥ Coding!</strong></p>
								<p>I completed several interesting applications on my way of programming.[ click images to reveal more ]</p>
								<div class="showcase-desc"></div>
								<div id="work-showcase">
									<a id="ipapp" title="SleepDetective iPhone App">
										<img src="./img/1_s.jpg" alt="ipapp" />
										<span class="hide">
											<ul>
												<li class="Name">
													<b>Name:</b>
													<em>SleepDetective iPhone App</em>
												</li>
												<li class="Language">
													<b>Implementation:</b>
													<em>Objective-C</em>
												</li>
												<li class="Description">
													<b>Description:</b>
													<em> This project is inspired from my interest in iPhone's sensors. In SleepDetective, sensors are used for detecting body movement and surrounding noise level.Thus,it helps users to track their sleep quality.</em>
												</li>
											</ul>
										</span>
									</a>
									<a id="feiweb" title="My Website" href="./img/1_b_2.jpg" rel="feiweb_g">
										<img src="./img/1_s.jpg" alt="feiweb" />
										<span class="hide">
											<ul>
												<li class="Name">
													<b>Name:</b>
													<em>Twitter Map</em>
												</li>
												<li class="Language">
													<b>Implementation:</b>
													<em>HTML, AJAX, JQuery, and Java Servlet</em>
												</li>
												<li class="Description">
													<b>Description:</b>
													<em> TwitterMap is a web application that display twitter users' location and tweets on Google Maps, utilizing Google Maps API and Twitter REST API.</em>
												</li>
											</ul>
										</span>									
									</a>
									<a id="twtmap" title="TwitterMap" href="./img/3_b.jpg" rel="twtmap_g">
										<img src="./img/3_s.jpg" alt="twtmap" />
										<span class="hide">
											<ul>
												<li class="Name">
													<b>Name:</b>
													<em>Twitter Map</em>
												</li>
												<li class="Language">
													<b>Implementation:</b>
													<em>HTML, AJAX, JQuery, and Java Servlet</em>
												</li>
												<li class="Description">
													<b>Description:</b>
													<em> TwitterMap is a web application that display twitter users' location and tweets on Google Maps, utilizing Google Maps API and Twitter REST API.</em>
												</li>
											</ul>
										</span>
									</a>
									<a id="autosys" title="Autosys Web Manager" rel="autosys_g">
										<img src="./img/4_s.jpg" alt="autosys" />
										<span class="hide">
											<ul>
												<li class="Name">
													<b>Name:</b>
													<em>Autosys Management System</em>
												</li>
												<li class="Language">
													<b>Implementation:</b>
													<em>HTML, AJAX, Javascript, and Java</em>
												</li>
												<li class="Description">
													<b>Description:</b>
													<em> I Rewrote old GUI to web application, improve webpage  loading rate by over 400%, and wrote a new algorithm for quick task management.That was my first time using Javascript and AJAX in real project, I decided  to write my own codes instead of using other Javascript/Java frameworks, so I could benefit more from coding. And so it was! </em>
												</li>
											</ul>
											/span>
									</a>
									<a id="taskmgr" title="Remote System Task Manager" rel="taskmgr_g">
										<img src="./img/5_s.jpg" alt="taskmgr" />
										<span class="hide">
											<ul>
												<li class="Name">
													<b>Name:</b>
													<em> Remote System Task Manager</em>
												</li>
												<li class="Language">
													<b>Implementation:</b>
													<em>HTML,JQuery, Java Servlet</em>
												</li>
												<li class="Description">
													<b>Description:</b>
													<em> Remote System Task Manager is a web-based tool for monitoring and managing computer system tasks. It simulated Window task manager's functions but it could be deployed to remote servers in different operation systems. I chose Microsoft SQLServer as database because I never used it before and I was willing to try this time.</em>
												</li>
											</ul>
										</span>
									</a>
									<a id="3dworld" title="3D World Tour" href="http://player.vimeo.com/video/19768253" rel="3dworld_g">
										<img src="./img/6_s.jpg" alt="3dworld" />
										<span class="hide">
											<ul>
												<li class="Name">
													<b>Name:</b>
													<em> 3D World Tour</em>
												</li>
												<li class="Language">
													<b>Implementation:</b>
													<em>C++ and OPENGL API</em>
												</li>
												<li class="Description">
													<b>Description:</b>
													<em> 3D world program is an OPENGL Program in which user could move the eye position around the world under user control.User could control to switch the ambient lights, move speed, direction, and etc.</em>
												</li>
											</ul>
										</span>
									</a>
								</div>
							</div>	
						</div>
                		<!-- <div class="panel" id="resume">
							<div class="panel-bg">	
								<img src="./img/resume.png" />
								<p>Download PDF version</p>
							</div>	
						</div>	 -->					
                		<div class="panel" id="life">
							<div class="panel-bg life">	
								<img src="./img/life.png" />
								<p><em><a href="http://www.flickr.com/hfknight"><strong>Photography</strong></a> is the way I remain precious moment of inspiration and pleasure in daily life.</em></p>
								<p>Entrance ...</p>
								<div class="embeded"></div>
							</div>	
						</div>
                		<div class="panel" id="contact">
							<div class="panel-bg contact">	
								<img src="./img/contact.png" />
									<p>Tel: 1-214.709.2411</p>
									<p>E-mail me: hfknight2003[AT]gmail[dot]com</p>	
									<p class="highlight">You can also find me here: </p>
									<ul>
										<li>
											<a class="twitter" target="_black" title="twitter" href="http://twitter.com/parn_fe"></a>
										</li>
										<li>
											<a class="linkedin" title="linkedin" href="http://linkenedin.com/hfknight"></a>
										</li>
										<li>
											<a class="facebook" title="facebook" href="http://facebook.com/hfknight"></a>
										</li>																				
										<li>
											<a class="flickr" title="flickr" href="http://flickr.com/hfknight"></a>
										</li>
										<li>
											<a class="friendfeed" title="friendfeed" href="http://friendfeed.com/hfknight"></a>
										</li>	
										<li>
											<a class="vimeo" title="vimeo" href="http://vimeo.com/hfknight"></a>
										</li>																																				
									</ul>
							</div>	
						</div>
                	</div>
            	</div>
				<ul class="navigation">
	                <li><a class="selected" href="#home">HOME</a></li>
	            	<li><a href="#about">ABOUT</a></li>
	                <li><a href="#work">WORK</a></li>
	                <!-- <li><a href="#resume">RESUME</a></li> -->		
	                <li><a href="#life">LIFE</a></li>
	                <li><a href="#contact">CONTACT</a></li>
				</ul>
        	</div>
			<div id="footer">
				Best viewed in Firefox. Copyright &copy; 2011 &nbsp;
				<b> Fei Hu </b>
			</div>
    	</div>
		<div id="logo"></div>
	</body>
</html>